<template>
  <div id="app" v-bind:style="appDivStyle">
      <div class="context" ref="context">
           <div class="queryBox" ref="queryBox">
                <el-form :model="formQueryCondition"
                         ref="form" size="mini">
                    <!--查询条件-->
                    <el-row>
                        <el-col :span="5">
                            <!--资产编号-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.code')"
                            :label-width="queryformLabelWidth">
                                <el-input v-model.trim="formQueryCondition.code.val" class="queryItemStyle" clearable
                                        :placeholder="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.placeholderCode')"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!--资产名称-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.name')"   :label-width="queryformLabelWidth">
                                <el-input v-model.trim="formQueryCondition.name.val" class="queryItemStyle" clearable
                                        :placeholder="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.placeholderName')">
                                </el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!--资产来源-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.source')"  :label-width="queryformLabelWidth">
                                <el-select v-model="formQueryCondition.source.val" class="queryItemStyle">
                                    <el-option :label="$t('ParentAssetIssuance.label.all')" value=""></el-option>
                                    <el-option :value="item.keyId" :key="item.keyId" :label="item.speAreaName" v-for="item in assetSourceData"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!--资产类型-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.type')"  :label-width="queryformLabelWidth">
                                <el-select v-model="formQueryCondition.type.val" class="queryItemStyle">
                                    <el-option :label="$t('ParentAssetIssuance.label.all')" value=""></el-option>
                                    <el-option :value="item.valueCode" :key="item.valueCode" :label="item.valueText" v-for="item in assetTypeData"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <!--下发状态-->
                    <!-- <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.status')"  :label-width="queryformLabelWidth">
                        <el-select v-model="formQueryCondition.sendtoState.val" class="queryItemStyle">
                            <el-option :label="$t('ParentAssetIssuance.label.all')" value=""></el-option>
                            <el-option :value="item.valueCode" :key="item.valueCode" :label="item.valueText" v-for="item in sendtoStateData"></el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-row>
                        <el-col :span="5">
                            <!--创建时间-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.createTime')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.createTimeStart.val" class="queryItemStyle"
                                                type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')">
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!-- 至 -->
                            <el-form-item :label="$t('ParentAssetIssuance.label.zhi')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.createTimeEnd.val" class="queryItemStyle"
                                                type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!--修改时间-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.lastUpdateTime')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.lastUpdateTimeStart.val" class="queryItemStyle"
                                                type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!-- 至 -->
                            <el-form-item :label="$t('ParentAssetIssuance.label.zhi')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.lastUpdateTimeEnd.val" class="queryItemStyle"
                                            type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="5">
                            <!--授权到期时间-->
                            <el-form-item :label="$t('ParentAssetIssuance.queryLabel.ParentAssetIssuance.expireTime')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.expireTimeStart.val" class="queryItemStyle"
                                                type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                            </el-form-item>
                        </el-col>
                        <el-col :span="5" :offset="1">
                            <!-- 至 -->
                            <el-form-item :label="$t('ParentAssetIssuance.label.zhi')"  :label-width="queryformLabelWidth">
                                <el-date-picker v-model="formQueryCondition.expireTimeEnd.val" class="queryItemStyle"
                                                type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>


                    <!--列表上面的按钮-->
                    <el-row>
                        <el-col :span="24">
                            <div style="text-align:right">
                                <!--新增-->
                                <!-- <el-form-item>
                                    <el-button type="primary" @click="onNew">{{ $t('ParentAssetIssuance.btnText.newBtnText') }}</el-button>
                                </el-form-item> -->
                                <!--批量下发-->
                                <el-form-item>
                                    <el-button v-permission="{menuCode: menuCode, resourceCode: 'batchSendBtnText'}"
                                    type="primary" @click="onBatchSend('batchSendBtnText')">{{$t('ParentAssetIssuance.btnText.sendBatchBtnText')}}</el-button>
                                <!-- </el-form-item> -->
                                <!--重置-->
                                <!-- <el-form-item> -->
                                    <el-button v-permission="{menuCode: menuCode, resourceCode: 'resetBtnText'}"
                                    type="primary" @click="onReset('form')">{{ $t('ParentAssetIssuance.btnText.resetBtnText') }}</el-button>
                                <!-- </el-form-item> -->
                                <!--查询-->
                                <!-- <el-form-item> -->
                                    <el-button v-permission="{menuCode: menuCode, resourceCode: 'queryBtnText'}"
                                    type="primary" @click="onQuery('queryBtnText')" icon="el-icon-search" :loading="loading">{{ $t('ParentAssetIssuance.btnText.queryBtnText') }}</el-button>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <!--列表-->
            <div class="dataBox" ref="dataBox">

                <el-table v-if="isInit" ref="singleTable"
                            :data="tableData"
                            :height="tableHeight"
                            @sort-change="sortChange"
                            @selection-change="changeBox"
                            v-loading="loading" size="mini"
                            style="width: 100%;" stripe=stripe border=border>
                    <!--序号-->
                    <!-- <el-table-column type="index"  width="50" fixed="left"
                                        :label="$t('table.xh')" align="center">
                    </el-table-column> -->
                    <!--复选框  :selectable='checkboxInit' -->
                    <el-table-column type="selection" width="35" align="center" fixed="left" :selectable='checkboxInit'>
                    </el-table-column>
                    <!--操作-->
                    <el-table-column :label="$t('table.op')" fixed="left" min-width="230" align="center">
                        <template slot-scope="scope">
                            <!--资产详情-->
                            <el-button size="gv" icon="el-icon-tickets" :loading="loading"
                             @click="clickDetails(scope.$index, scope.row,'detailsBtnText')"
                             v-permission="{menuCode: menuCode, resourceCode: 'detailsBtnText'}"
                                        >{{ $t('ParentAssetIssuance.btnText.detailsBtnText') }}</el-button>
                            <!--跳转到剧集-->
                            <el-button size="gv" icon="el-icon-tickets" :loading="loading"
                             @click="selectAssetIssuance(scope.$index, scope.row)"
                             v-permission="{menuCode: menuCode, resourceCode: 'subassetBtnText'}"
                                        >{{ $t('ParentAssetIssuance.btnText.subAssetBtnText') }}</el-button>
                            <!--下发-->
                            <el-button size="gv" icon="el-icon-delete"
                                type="danger" :loading="loading" @click="onSend(scope.$index, scope.row,'sendBtnText')" :disabled="scope.row.assetStateByQuery!='ExaminationPassed'||scope.row.sendtoStateByQuery !='StayDown'"
                                v-permission="{menuCode: menuCode, resourceCode: 'sendBtnText'}"
                                    >{{ $t('ParentAssetIssuance.btnText.sendBtnText') }}</el-button>
                        </template>
                    </el-table-column>
                    <!--资产编号-->
                    <el-table-column prop="assetCode" min-width="150" fixed="left"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.code')" sortable="custom" sort-by="assetCode">
                    </el-table-column>
                    <!--资产名称-->
                    <el-table-column prop="assetName" min-width="180" fixed="left"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.name')" sortable="custom" sort-by="assetName">
                    </el-table-column>
                    <!--资产来源-->
                    <el-table-column prop="speAreaName" min-width="110"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.source')" sortable="custom" sort-by="speAreaName" >
                    </el-table-column>
                    <!--资产状态-->
                    <el-table-column prop="assetState" min-width="110"
                                        :label="$t('AssetIssuance.table.shellAssets.status')" sortable="custom" sort-by="assetState">
                    </el-table-column>
                    <!--资产类型-->
                    <el-table-column prop="assetType" min-width="110"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.type')" sortable="custom" sort-by="assetType">
                    </el-table-column>
                    <!--下发状态-->
                    <el-table-column prop="sendtoStateName" min-width="110"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.status')" sortable="custom" sort-by="sendtoState">
                    </el-table-column>
                    <!--授权时间
                    <el-table-column prop="expireTime" min-width="120"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.expireTime')" sortable="custom" sort-by="expireTime">
                    </el-table-column>
                    -->
                    <!--版权结束时间-->
                    <el-table-column prop="copyrightEndDate" min-width="180"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.expireEndTime')" sortable="custom" sort-by="copyrightEndDate">
                    </el-table-column>
                    <!--创建时间-->
                    <el-table-column prop="createdDate" min-width="180"
                                        :label="$t('ParentAssetIssuance.table.ParentAssetIssuance.createTime')" sortable="custom" sort-by="createdDate">
                    </el-table-column>
                    <!--最后修改时间-->
                    <el-table-column :label="$t('ParentAssetIssuance.table.lastUpdateTime')" min-width="180" sortable="custom" prop="lastUpdatedDate" sort-by="lastUpdatedDate">
                    </el-table-column>
                    <!--最后修改人-->
                    <el-table-column :label="$t('ParentAssetIssuance.table.lastUpdatedBy')" min-width="180" sortable="custom" prop="modifier" sort-by="modifier">
                    </el-table-column>

                </el-table>


            </div>
        </div>
        <!--分页-->
        <div class="pageBox">
            <el-pagination @size-change="sizeChange"
                            @current-change="currentPageChange"
                            :current-page="pager.curPage"
                            :page-sizes="pager.sizes"
                            :page-size="pager.curSize"
                            :background="true"
                            layout="total, sizes, prev, pager, next, jumper" :total="pager.total">
            </el-pagination>
        </div>

        <!--编辑对话框-->
        <el-dialog :title="$t('label.dialogTitle')" :visible.sync="isShowEditForm" top="5vh" :close-on-click-modal="false">
            <el-form :model="editForm" ref="editForm" size="mini"
                     :label-position="editFormPosition" status-icon=status-icon :rules="editRules">

                <!--资产名称-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.name')" :label-width="editformLabelWidth" prop="name">
                    <el-input v-model.trim="editForm.name" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.name')"></el-input>
                </el-form-item>
                <!--资产类型-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.type')" :label-width="editformLabelWidth">
                    <el-select v-model="editForm.type">
                        <el-option :label="$t('ParentAssetIssuance.label.shellAssetsType1')" value="shellAssetsType1"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.shellAssetsType2')" value="shellAssetsType2"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.shellAssetsType3')" value="shellAssetsType3"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.shellAssetsType4')" value="shellAssetsType4"></el-option>
                    </el-select>
                </el-form-item>
                <!--资产来源-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.source')" :label-width="editformLabelWidth">
                    <el-select v-model="editForm.source">
                        <el-option :value="item.keyId" :key="item.keyId" :label="item.speAreaName" v-for="item in assetSourceData"></el-option>
                    </el-select>
                </el-form-item>
                <!--资产提供方信息-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.sourceInfo')" :label-width="editformLabelWidth" prop="sourceInfo">
                    <el-input v-model.trim="editForm.sourceInfo" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.sourceInfo')"></el-input>
                </el-form-item>
                <!--版权开始时间-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.expireTime')" :label-width="editformLabelWidth" prop="expireTime">
                    <el-date-picker v-model="editForm.expireTime" type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                </el-form-item>
                <!--版权结束时间-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.expireEndTime')" :label-width="editformLabelWidth" prop="expireEndTime">
                    <el-date-picker v-model="editForm.expireEndTime" type="date" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                </el-form-item>
                <!--首字母-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.initials')" :label-width="editformLabelWidth" prop="initials">
                    <el-input v-model.trim="editForm.initials" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.initials')"></el-input>
                </el-form-item>
                <!--年份-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.years')" :label-width="editformLabelWidth" prop="years">
                    <el-date-picker v-model="editForm.years" type="year" :placeholder="$t('ParentAssetIssuance.label.pleaseSelectTime')"></el-date-picker>
                </el-form-item>
                <!--地区-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.area')" :label-width="editformLabelWidth">
                    <el-select v-model="editForm.area">
                        <el-option :label="$t('ParentAssetIssuance.label.area1')" :value="$t('ParentAssetIssuance.label.area1')"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.area2')" :value="$t('ParentAssetIssuance.label.area2')"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.area3')" :value="$t('ParentAssetIssuance.label.area3')"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.area4')" :value="$t('ParentAssetIssuance.label.area4')"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.area5')" :value="$t('ParentAssetIssuance.label.area5')"></el-option>
                    </el-select>
                </el-form-item>
                <!--语言-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.language')" :label-width="editformLabelWidth" prop="language">
                    <el-input v-model.trim="editForm.language" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.language')"></el-input>
                </el-form-item>
                <!--集数-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.episode')" :label-width="editformLabelWidth" prop="episode">
                    <el-input v-model.trim="editForm.episode" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.episode')"></el-input>
                </el-form-item>
                <!--导演-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.director')" :label-width="editformLabelWidth" prop="director">
                    <el-input v-model.trim="editForm.director" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.director')"></el-input>
                </el-form-item>
                <!--编辑-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.edit')" :label-width="editformLabelWidth" prop="edit">
                    <el-input v-model.trim="editForm.edit" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.edit')"></el-input>
                </el-form-item>
                <!--演员-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.actor')" :label-width="editformLabelWidth" prop="actor">
                    <el-input v-model.trim="editForm.actor" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.actor')"></el-input>
                </el-form-item>
                <!--播出状态-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.playStatus')" :label-width="editformLabelWidth">
                    <el-select v-model="editForm.playStatus">
                        <el-option :label="$t('ParentAssetIssuance.label.playStatus1')" value="playStatus1"></el-option>
                        <el-option :label="$t('ParentAssetIssuance.label.playStatus2')" value="playStatus2"></el-option>
                    </el-select>
                </el-form-item>
                <!--评分-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.score')" :label-width="editformLabelWidth" prop="score">
                    <el-input v-model.trim="editForm.score" maxlength="20"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.score')"></el-input>
                </el-form-item>
                <!--简介-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.introduction')" :label-width="editformLabelWidth" prop="introduction">
                    <el-input v-model.trim="editForm.introduction" maxlength="300"  type="textarea"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.introduction')"></el-input>
                </el-form-item>
                <!--剧情-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.plot')" :label-width="editformLabelWidth" prop="plot">
                    <el-input v-model.trim="editForm.plot" maxlength="300"  type="textarea"
                              :placeholder="$t('ParentAssetIssuance.label.placeholder')+$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.plot')"></el-input>
                </el-form-item>
                <!--海报-->
                <el-form-item :label="$t('ParentAssetIssuance.editLabel.ParentAssetIssuance.poster')" :label-width="editformLabelWidth" prop="poster">
                    <el-upload v-model.trim="editForm.poster" class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/"
                               :on-preview="handlePreview" :on-remove="handleRemove"
                               :file-list="fileList2" list-type="picture"> <el-button size="small" type="primary">{{ $t('btnText.clickUpload') }}</el-button>
                    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>
            </el-form>
            <div slot="footer">
                <!--取消按钮-->
                <el-button size="mini" @click="isShowEditForm = false" :loading="loading">{{ $t('btnText.cancelBtnText') }}</el-button>
                <!--保存按钮-->
                <el-button size="mini" type="primary" @click="submitForm('editForm')" :loading="loading">{{ $t('btnText.saveBtnText') }}</el-button>
            </div>
        </el-dialog>

        <!--详情对话框-->
        <el-dialog :title="$t('label.dialogDetails')" :visible.sync="isShowDetails" top="5vh" width="60%" :close-on-click-modal="false">
            <el-tabs v-model="activeName" type="border-card">
            <el-tab-pane :label="$t('ParentAssetIssuance.label.assetInfo')" name="first">
                <assets-info :datas="dataForm"></assets-info>
            </el-tab-pane>

            </el-tabs>
        </el-dialog>

        <!-- 下发对话框 -->
        <transition enter-active-class="animated rotateIn" leave-active-class="animated rotateOut">
        <el-dialog :title="$t('AssetIssuance.label.launchDialogTitle')" :visible.sync="isShowEditForm2" top="5vh" @close="refresh" :close-on-click-modal="false">
            <el-form :inline="true" :model="sendForm" ref="sendForm" size="mini"
                     :label-position="editFormPosition" status-icon=status-icon :rules="sendRules">

            <el-row>
                <el-form-item :label="$t('')" :label-width="editformLabelWidth" prop="siteList">
                    <el-checkbox-group v-model="sendForm.siteList" >
                        <!-- <el-checkbox :label="$t('AssetIssuance.editLabel.move')" name="site"></el-checkbox>
                        <el-checkbox :label="$t('AssetIssuance.editLabel.telecomN')" name="site"></el-checkbox>
                        <el-checkbox :label="$t('AssetIssuance.editLabel.telecomS')" name="site"></el-checkbox>
                        <el-checkbox :label="$t('AssetIssuance.editLabel.unicom')" name="site"></el-checkbox> -->
                        <el-checkbox :value="item.siteName" :key="item.keyId" :label="item.keyId" v-for="item in siteData">{{item.siteName}}</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
            </el-row>

            </el-form>
            <div slot="footer">
                <el-button size="mini" @click="isShowEditForm2 = false" :loading="loading">{{ $t('btnText.cancelBtnText') }}</el-button>
                <el-button size="mini" type="primary" @click="comfirmSend('sendForm',currentResCode)" :loading="loading">{{ $t('btnText.sendConfirmBtnText') }}</el-button>
            </div>

        </el-dialog>
      </transition>

  </div>


</template>

<script>

import comBaseVue from '../../baseViewModel';
import assetsInfo from  './AssetIssuanceInfo';
import { stringify } from 'querystring';
import Vue from 'vue';

export default {
  mixins: [comBaseVue],
  name:'ParentAssetIssuance',
  props: {
    menuCode: String,
  },
  data () {

    return {
        isShowActor:  false,
        isShowDetails:false,
        isShowEditForm2: false,
        activeName: 'first',
        isInit:false,
        tableHeight:100,
        queryformLabelWidth:"85px",
        multipleSelection: [],
        singleSend:{},
        siteData:[],
        assetTypeData:[],
        assetSourceData:[],
        sendtoStateData:[],
        appDivStyle:{
            height:this.$store.getters.appHeight,
        },
        modelName:"com.ispr.iptv.entity.media.AssetEntity",//操作的实体类
        modelName2:"com.ispr.iptv.entity.media.VAssetEntity",//操作的实体类F

        fileList2: [],
        changeLogData:[],
        // 查询条件
        formQueryCondition: {
            code: {
                key: 'assetCode',
                op: 'LIKE', // 操作符
                val: '' // 查询的值
            },
            name: {
                key: 'assetName',
                op: 'LIKE',
                val: ''
            },
            source: {
                key: 'assetSource',
                op: '=',
                val: ''
            },
            type: {
                key: 'assetType',
                op: '=',
                val: ''
            },

            createTimeStart: {
                key: 'createdDate',
                group: 'createTimeStart',
                op: '>=',
                val: ''
            },
            createTimeEnd: {
                key: 'createdDate',
                group: 'createTimeEnd',
                op: '<=',
                val: ''
            },
            lastUpdateTimeStart: {
                key: 'lastUpdatedDate',
                group: 'lastUpdateTimeStart',
                op: '>=',
                val: ''
            },
            lastUpdateTimeEnd: {
                key: 'lastUpdatedDate',
                group: 'lastUpdateTimeEnd',
                op: '<=',
                val: ''
            },
            expireTimeStart: {
                key: 'copyrightEndDate',
                group: 'expireTimeStart',
                op: '>=',
                val: ''
            },
            expireTimeEnd: {
                key: 'copyrightEndDate',
                group: 'expireTimeEnd',
                op: '<=',
                val: ''
            },
            isEnable: {
                key: 'isEnable',
                op: '=',
                val: 'Available'
            },
            assetState: {
                key: 'assetState',
                op: '=',
                val: 'ExaminationPassed'

            },
            sendtoState: {
                key: 'sendtoState',
                op: '=',
                val: 'StayDown',
                group: 'sendtoState'
            },
            isStaydown: {
                key: 'isStaydown',
                op: '=',
                val: 'YES',
                group: 'sendtoState'
            },
        },

        // 编辑面板绑定的对象
        editForm: {
            keyID: 0,
            version: 0,
            name: "",
            type: "",
            source: "",
            userStatus: "",
            boxType: "",
            operator: "",

            tname: "",
            type: "",
            source: "",
            sourceInfo: "",
            expireTime: "",
            expireEndTime: "",
            classification: "",
            initials: "",
            years: "",
            area: "",
            language: "",
            episode: "",
            director: "",
            edit: "",
            actor: "",
            playStatus: "",
            boxOffice: "",
            score: "",
            introduction: "",
            plot: "",
            poster: "",
        },
        // 编辑面板的验证规则
        editRules: {
            name: [{ required: true, message: this.$i18n.t('ParentAssetIssuance.label.placeholder')+this.$i18n.t('ParentAssetIssuance.editLabel.ParentAssetIssuance.name'), trigger: 'blur' }],
        },
        dataForm: {
            keyID: 0,
            version: 0,
            code: "",
            name: "",
            source: "",
            type: "",
            providerInfo:"",
            status:"",
            createTime:"",
            updateTime:"",
            tag:"",
            sort:"",
            copyRightTimeS:"",
            copyRightTimeE:"",
            copyRightSource:"",
            copyRightRemark:"",
            cnName:"",
            firstChar:"",
            year:"",
            area:"",
            language:"",
            count:"",
            contentSort:"",
            director:"",
            adaptor:"",
        },
        sendRules: {
            siteList: [{ required: true, message: this.$i18n.t('ParentAssetIssuance.rules.sendCheckTip'), trigger: 'blur' }],
        },
        //下发
        sendForm: {
            siteList: [],//下发到的站点
            sendType:"",
        },

    }
  },
  methods:{
     // 查询按钮
    onQuery: function(rescode) {
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        if(this.formQueryCondition.createTimeStart.val){
            this.formQueryCondition.createTimeStart.val = this.formatDate(this.formQueryCondition.createTimeStart.val);
        }
        if(this.formQueryCondition.createTimeEnd.val){
            this.formQueryCondition.createTimeEnd.val=this.formatDate(this.formQueryCondition.createTimeEnd.val);
        }
        if(this.formQueryCondition.lastUpdateTimeStart.val){
            this.formQueryCondition.lastUpdateTimeStart.val = this.formatDate(this.formQueryCondition.lastUpdateTimeStart.val);
        }
        if(this.formQueryCondition.lastUpdateTimeEnd.val){
            this.formQueryCondition.lastUpdateTimeEnd.val=this.formatDate(this.formQueryCondition.lastUpdateTimeEnd.val);
        }
        if(this.formQueryCondition.expireTimeStart.val){
            this.formQueryCondition.expireTimeStart.val = this.formatDate(this.formQueryCondition.expireTimeStart.val);
        }
        if(this.formQueryCondition.expireTimeEnd.val){
            this.formQueryCondition.expireTimeEnd.val=this.formatDate(this.formQueryCondition.expireTimeEnd.val);
        }

        this.pager.curPage = 1;
        this.queryTable();
    },
    // 查询网格数据
      queryTable: function() {
          this.loading = true;
          this.queryModel(this.modelName2,"Query",this.formQueryCondition,this.pager,this.sort,this.setTableData)
      },

     // 查询网格数据
    // queryTable: function() {
    //     this.loading = true;
    //     //auditConfirm
    //     this.auditConfirmQuery("/api/mediaAudit/send",this.modelName,"Query",this.formQueryCondition,this.pager,this.sort,this.setTableData);
    // },
    // 新增
    onNew: function() {
        this.isShowEditForm = true;
        if (this.$refs['editForm']) {
            this.$refs['editForm'].resetFields();
        }
        this.editForm.keyID = "";
        this.editForm.version = "";
        this.editForm.name = "";//"资产名称",
        this.editForm.type = "shellAssetsType1";//"资产类型",
        this.editForm.source = "shellAssetsSource1";//"资产来源",
        this.editForm.sourceInfo = "";//"资产提供方信息",
        this.editForm.expireTime = "";//"版权开始时间",
        this.editForm.expireEndTime = "";//"版权结束时间",
        this.editForm.classification = "";//"资产类型",
        this.editForm.initials = "";//"首字母",
        this.editForm.years = "2018";//"年份",
        this.editForm.area = "area1";//"地区",
        this.editForm.language = "";//"语言",
        this.editForm.episode = "";//"集数",
        this.editForm.director = "";//"导演",
        this.editForm.edit = "";//"编辑",
        this.editForm.actor = "";//"演员",
        this.editForm.playStatus = "playStatus1";//"播出状态",
        this.editForm.boxOffice = "";//"票房",
        this.editForm.score = "";//"评分",
        this.editForm.introduction = "";//"简介",
        this.editForm.plot = "";//"剧情",
        this.editForm.poster = "";//"海报",
        this.curCommand = "SaveNew";
        this.canEditCode = false;
    },

     // 重置
    onReset:function(){
        if (this.$refs['form']) {
            this.$refs['form'].resetFields();
        }
        this.formQueryCondition.code.val = "";
        this.formQueryCondition.name.val = "";
        this.formQueryCondition.source.val = "";
        this.formQueryCondition.type.val = "";
        // this.formQueryCondition.sendtoState.val = "";
        this.formQueryCondition.createTimeStart.val = "";
        this.formQueryCondition.createTimeEnd.val = "";
        this.formQueryCondition.lastUpdateTimeStart.val = "";
        this.formQueryCondition.lastUpdateTimeEnd.val = "";
        this.formQueryCondition.expireTimeStart.val = "";
        this.formQueryCondition.expireTimeEnd.val = "";
    },

    // 授权按钮单击事件
    editMenu: function(index, row) {

    },
    //回退事件
    back: function(isSuccess, json) {
        //this.$router.go(-1);//后退
        this.$parent.setCurrentComponent("goBack",null);
    },
    refresh: function(){
        if (this.$refs['sendForm']) {
            this.$refs['sendForm'].resetFields();
        }
        this.sendForm.siteList = [];
    },
    //单个下发
    onSend: function(index, row,rescode) {
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        this.sendForm.sendType = "single";
        this.singleSend = {};
        let keyId = row.keyId;
        let version = row.version;
        let sendtoState = "DownAlready";
        let data = {"keyId":keyId,"version":version,"sendtoState":sendtoState};
        this.singleSend = data;
        this.isShowEditForm2 = true;
    },

    // 批量下发
    onBatchSend: function(rescode) {
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
        if(this.multipleSelection.length==0){
            this.$message({
                message: this.$i18n.t("AssetIssuance.label.checkTip"),
                type: 'warning'
            });
            return;
        };
        this.sendForm.sendType = "batch";
        this.isShowEditForm2 = true;
    },
    // 提交下发界面数据
    comfirmSend: function (formName, rescode){
            this.currentResCode = (rescode && rescode!=='') ? rescode : '';

        var _this = this;
        let dataList = [];//最终传给后台的总数据
        let siteListJson = [];//站点的数据
        for (let i=0;i<this.sendForm.siteList.length;i++){
            let siteId = this.sendForm.siteList[i];
            let resType = "A";
            let state = "DownAlready";
            let data = {"siteId":siteId,"resType":resType,"state":state};
            siteListJson.push(data);
        };
        if(this.sendForm.sendType=="batch"){
            for(let i=0;i<this.multipleSelection.length;i++){
                let temp = this.multipleSelection[i];
                temp.siteList = siteListJson;
                dataList.push(temp);
            }
        }else if(this.sendForm.sendType=="single"){
            this.singleSend.siteList = siteListJson;
            dataList.push(this.singleSend);
        }
        this.$refs[formName].validate(function (valid) {
            if (valid) {
                _this.loading = true;
                _this.procCommand("MediaSendToProc",
                _this.modelName,
                "Default",
                {
                    "dataList":dataList,
                },
                null,
                _this.comfirmSendCallback);
            } else {
                return false;
            }
        });
    },
    // 执行命令后的回调函数
    comfirmSendCallback: function (isSuccess,json) {

        this.loading = false;
        if(isSuccess){
            this.isShowEditForm2 = false;
            this.$message({
                message: this.$i18n.t("message.successTip"),//resource.message.successTip,
                type: 'success'
            });
            this.queryTable();
        }
        else
        {
            this.$message.error(json.msg);
            // this.$message({
            //                 message: this.$i18n.t("errorCode." + json.reason),
            //                 type: 'warning'
            //                 });

        }
    },
    // 编辑按钮回调事件
    editCallback: function(isSuccess,json) {
        if(isSuccess){
            this.curCommand = "UpdateProc";
            this.isShowEditForm = true;
            if (this.$refs['editForm']) {
                this.$refs['editForm'].resetFields();
            }

            this.editForm = json;
            // this.editForm.keyID = json.keyID;
            // this.editForm.version = json.version;
            // this.editForm.name = json.name;//"资产名称",
            // this.editForm.type = json.type;//"资产类型",
            // this.editForm.source = json.source;//"资产来源",
            // this.editForm.sourceInfo = json.sourceInfo;//"资产提供方信息",
            // this.editForm.expireTime = json.expireTime;//"版权开始时间",
            // this.editForm.expireEndTime = json.expireEndTime;//"版权结束时间",
            // this.editForm.classification = json.classification;//"资产类型",
            // this.editForm.initials = json.initials;//"首字母",
            // this.editForm.years = json.years;//"年份",
            // this.editForm.area = json.area;//"地区",
            // this.editForm.language = json.language;//"语言",
            // this.editForm.episode = json.episode;//"集数",
            // this.editForm.director = json.director;//"导演",
            // this.editForm.edit = json.edit;//"编辑",
            // this.editForm.actor = json.actor;//"演员",
            // this.editForm.playStatus = json.playStatus;//"播出状态",
            // this.editForm.boxOffice = json.boxOffice;//"票房",
            // this.editForm.score = json.score;//"评分",
            // this.editForm.introduction = json.introduction;//"简介",
            // this.editForm.plot = json.plot;//"剧情",
            // this.editForm.poster = json.poster;//"海报",
            this.canEditCode = true;

        }
        else{
            this.$message({
                message: json.msg,
                type: 'warning'
                });
        }
    },

    handleRemove(file, fileList) {
        console.log(file, fileList);
      },
    handlePreview(file) {
        console.log(file);
    },

    // 详情按钮单击事件
    clickDetails: function(index, row,rescode) {
        this.currentResCode = (rescode && rescode!=='') ? rescode : '';
       this.queryModelByKeyID(this.modelName,row.keyId,"Query",this.showDetails);

    },
    // 详情按钮回调事件
    showDetails: function(isSuccess,json) {
        if(isSuccess){
            this.isShowDetails = true;
            this.dataForm=json;
            if(json.assetYear!=null && json.assetYear!="" && json.assetYear!="NaN"){
                this.dataForm.assetYear=json.assetYear;
            }else{
                this.dataForm.assetYear="";
            }
            var actor = "";
            var edit ="";
            var director = "";
            json.assetAndActorList.forEach(element =>{
                    var A = "";
                    if(element.profession == "导演"){
                        //element.profession == "director"
                        A = element.actorName;
                        if(director == ""){
                            director = A;
                        }else{
                            director = director+","+ A;
                        }
                    }else if(element.profession == "编剧"){
                        //element.profession == "screenwriter"
                        A = element.actorName;
                        if(edit == ""){
                            edit = A;
                        }else{
                            edit = edit+","+ A;
                        }
                    }else if(element.profession == "演员"){
                        //element.profession == "actor"
                        A = element.actorName;
                        if(actor == ""){
                            actor = A;
                        }else{
                            actor = actor+","+ A;
                        }
                    }
                })
            this.dataForm.director = director;//"导演",
            this.dataForm.adaptor = edit;//"编剧",
            this.dataForm.actor = actor;//"演员",

            this.dataForm.tagNameAll = "";
            let temp = "";
            json.assetAndTagList.forEach(element =>{
                if(temp==""){
                    temp = element.tagName;
                }else{
                    temp = element.tagName + "," + temp;
                }
            });
            this.dataForm.tagNameAll = temp;
        }else{
            this.$message({
                message: json.msg,
                type: 'warning'
                });
        }
    },

    handleClick(tab, event) {
        console.log(tab, event);
    },

    changeBox: function(val) {
        this.multipleSelection = [];
        for (let i=0;i<val.length;i++){
            let keyId = val[i].keyId;
            let version = val[i].version;
            let sendtoState = "DownAlready";
            let data = {"keyId":keyId,"version":version,"sendtoState":sendtoState};
            this.multipleSelection.push(data);
        }
    },

    checkboxInit: function(row,index){
        if (row.sendtoStateByQuery == 'StayDown') {
            return true;
        }else{
            return false;
        }
    },

    /**查看子资产信息 */
    selectAssetIssuance: function(index, row) {

        // this.queryModel("com.ispr.iptv.entity.media.SubAssetEntity","Query",{
        //     code: { key: 'assetId',  op: '=', val: row.keyId
        //     }},this.pager,this.sort,this.setTableDatas)
        this.$parent.setCurrentComponent("AssetIssuance",
            {
                curRootAssets:{
                    "assetId": row.keyId,
                    "sendtoStateFlag": row.sendtoStateByQuery,
                    "sendSiteId": row.sendSiteId
                },
                isNeedGoBack:true,
                menuCode:this.menuCode
            });
        //this.$parent.setCurrentComponent("AssetIssuance",{curRootAssets:row,isNeedGoBack:true });
    },
    setTableDatas: function(isSuccess,json) {

            console.info("-----");
            console.info(json);
            if (isSuccess) {
                this.tableDatas = [];
                for (let i = 0; i < json.list.length; i++) {
                    this.tableDatas.push(json.list[i]);
                }
                this.$parent.setCurrentComponent("AssetIssuance",{curRootAssets:this.tableDatas,isNeedGoBack:true,menuCode:this.menuCode });
            }
        },
    /**查看演员信息 */
    selectActorInfo: function(index, row) {
        this.$parent.setCurrentComponent("Actor",{curRootAssets:row,isNeedGoBack:true });
            // this.$router.push({
            //     path: 'Actor',
            //     name: 'Actor',
            //     params: {
            //     code: row.code,
            //     name: row.name,
            // } });//跳转到该路由
    },
    //资产类型下拉列表数据
    findAssetType: function(){
        this.findByTypeCode("10005",this.setAssetTypeCallback);
    },

    setAssetTypeCallback: function(isSuccess,json){
        try{
            if (isSuccess) {
                for (let i = 0; i < json.data.length; i++) {
                    this.assetTypeData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(json.msg);
            }
        }
        catch(e){
            alert(e);
        }
    },

    //资产来源下拉列表数据
    findAssetSource: function(){
      var queryRequest = {
        className: "com.ispr.iptv.entity.sys.SpeArea",//修改为被查询的实体地址
        opKey: "Query",//后台编写相应的接口实现方法，主要负责转化类型
        params: [{key: 'isEnable',op: '=',val: 'Available'}],
        userInfo: this.getUserInfo()
      };
      var _this = this;
      this.axios.post('/api/query', queryRequest, {headers: this.headersObj})
      .then(function(res) {
      // alert(JSON.stringify(res));
      // alert(res.data.code);
        if (res.data.code == "SUCCESS") {
          _this.assetSourceData = [];
          for (var i = 0; i < res.data.data.length; i++) {
          _this.assetSourceData.push(res.data.data[i]);
          }
        } else {
        // this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
        }
      })
      .catch(function(error) {
      console.log(error);
      // this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
      });
    },

    //下发状态下拉列表数据
    findSendtoState: function(){
        this.findByTypeCode("10011",this.setSendtoStateCallback);
    },

    setSendtoStateCallback: function(isSuccess,json){
        try{
            if (isSuccess) {
                for (let i = 0; i < json.data.length; i++) {
                    this.sendtoStateData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(json.msg);
            }
        }
        catch(e){
            alert(e);
        }
    },

     //站点复选框数据 siteData
    findSite: function(){
        var queryRequest = {
                className: "com.ispr.iptv.entity.sys.Site",//修改为被查询的实体地址
                opKey: "Query",//后台编写相应的接口实现方法，主要负责转化类型
                params: [{key: 'isEnable',op: '=',val: 'Available'}],
                userInfo: this.getUserInfo()
            };
            var _this = this;
            this.axios.post('/api/query', queryRequest, {headers: this.headersObj})
                .then(function(res) {
                    // alert(JSON.stringify(res));
                    // alert(res.data.code);
                    if (res.data.code == "SUCCESS") {
                        _this.siteData = [];
                        for (var i = 0; i < res.data.data.length; i++) {
                            _this.siteData.push(res.data.data[i]);
                        }
                    } else {
                        // this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
                    }
                })
                .catch(function(error) {
                    console.log(error);
                    // this.$message.error(this.$i18n.t("errorCode." + json.reason,json.message));
                });
    },

    setSiteCallback: function(isSuccess,json){
        try{
            if (isSuccess) {
                for (var i = 0; i < json.data.length; i++) {
                    this.approvalStatusData.push(json.data[i]);
                }
            }
            else {
                this.$message.error(json.msg);
            }
        }
        catch(e){
            alert(e);
        }
    },
    initTable:function(){
        //alert("setTimeout");
        this.tableHeight = this.$refs.context.offsetHeight - this.$refs.queryBox.offsetHeight;
        this.isInit = true;
    },
    enterDown(){
      var g = this
      if(g.isShowEditForm){
          g.submitFormForPass(g.currentResCode)
      }else if(g.isShowDetails){
          // 详情
          g.isShowDetails = false
      }else if(!g.loading){
          g.onQuery()
      }
    }

  },
  mounted: function mounted() {
    this.findSite();
    this.findAssetType();
    this.findAssetSource();
    this.findSendtoState();
    this.onQuery();
    window.setTimeout(this.initTable,100);
  },
  components: {
    "assets-info": assetsInfo
  },
  activated: function(){
      this.onQuery();
  },
}


</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
